import { Breadcrumb, Button, Tabs, message } from 'antd';
import React, { FC } from 'react';
import { useLocation, useNavigate } from 'react-router-dom';
import { FormPanelObject } from 'lfun-bg-comp';
import { PageContainer } from '@/component/page-container';
import BasicTop from '@/view/student/component/basicTop';
import BasicBody from '@/view/student/component/basicBody';
import styles from './index.less';
import { StuNewStudentSrv } from '@/service/student';
import utils, { getPathRoot } from '@/utils';
import { TNewStudents } from '@/service/student/types';

const Family = React.lazy(() => import('@/view/student/newStu/family'));
const Log = React.lazy(() => import('@/view/student/newStu/log'));

const Groups: FC = () => {
  const navigator = useNavigate();
  const location = useLocation();
  const [keyInfo, setKeyInfo] = React.useState<any>({});
  const [baseInfo, setBaseInfo] = React.useState({});

  let topCntForm;
  let topPhotoForm;
  const init = async () => {
    utils.showLoading();
    const r = await StuNewStudentSrv.getKeyInfo(location.state.student_id);
    const rbase = await StuNewStudentSrv.getBaseinfo(location.state.student_id);
    if (r.success) {
      setKeyInfo(r.data);
    }
    if (rbase.success) {
      setBaseInfo(rbase.data);
    }
    utils.hideLoaing(r.success && rbase.success);
  };
  React.useEffect(() => {
    init();
  }, []);
  return (
    <PageContainer
      header={
        <Breadcrumb
          items={[
            {
              title: '新生入学管理',
              onClick: e => {
                navigator(`${getPathRoot()}/newstudent`);
              },
            },
            { title: '信息变更' },
          ]}
        />
      }
    >
      <div className={styles.change_view}>
        <BasicTop
          onLoad={(form1, form2) => {
            topCntForm = form1;
            topPhotoForm = form2;
          }}
          onSave={async (formPanelObject: FormPanelObject) => {
            const values = formPanelObject.getValues();
            const updateValues: TNewStudents.KeyInfo = {
              ...values,
              student_id: location.state.student_id,
            };
            updateValues.birthday = values.birthday.format('YYYY-MM-DD');
            const res = await StuNewStudentSrv.updateKeyInfo(updateValues);
            if (res.success) {
              message.success('保存成功');
              init();
            } else {
              formPanelObject.reVaildation(res);
            }
            return res.success;
          }}
          onSavePhoto={async (fileList: any) => {
            if (fileList && fileList.length) {
              const updateValues: TNewStudents.KeyInfo = {
                ...keyInfo,
                photo: String(fileList[0].uid),
                birthday: keyInfo?.birthday?.format ? keyInfo?.birthday?.format('YYYY-MM-DD') : '',
              };
              const res = await StuNewStudentSrv.updateKeyInfo(updateValues);
              if (res.success) {
                message.success('保存成功');
                init();
              }
              return res.success;
            }
            return false;
          }}
          value={keyInfo}
          isEdit
        />
        <Tabs
          className={styles.tabs}
          type="card"
          items={[
            {
              label: '基本信息',
              key: '1',
              children: (
                <BasicBody
                  isEdit
                  //isShowStep={false}
                  value={baseInfo}
                  onFinish={async (formPanelObject: FormPanelObject) => {
                    const values = formPanelObject.getFieldsValue();
                    const updateValues = {
                      ...values,
                      student_base_id: location.state.student_id,
                      student_id: location.state.student_id,
                      identity_card_validity_period:
                        values.identity_card_validity_period && values.identity_card_validity_period.format
                          ? values.identity_card_validity_period.format('YYYY-MM-DD')
                          : '',
                    };
                    const res = await StuNewStudentSrv.updateBaseinfo(updateValues);
                    if (res.success) {
                      message.success('保存成功');
                      return true;
                    }
                    formPanelObject.reVaildation(res);
                    return false;
                  }}
                  buttonList={[
                    <Button type="dashed" onClick={() => navigator(-1)}>
                      返回
                    </Button>,
                  ]}
                />
              ),
            },
            {
              label: '家庭成员信息',
              key: '2',
              children: <Family />,
            },
            // {
            //   label: '变更日志',
            //   key: '3',
            //   children: <Log />,
            // },
          ]}
        />
      </div>
    </PageContainer>
  );
};

export default Groups;
